<template>
  <div class='navbar'>
    <div class="navbarTop">
      <div class="back" @click="$router.back()" v-if="showBack">
        <i class="iconfont back">&#xeb04;</i>
      </div>
      <div class="title">{{$route.meta.title}}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Navbar',
  data () {
    return {}
  },
  computed: {
    showBack () {
      return !this.$route.meta?.canotBack
    }
  }
}
</script>

<style lang='less' scoped>
@font-face {
  font-family: 'iconfont';  /* Project id 2965250 */
  src: url('//at.alicdn.com/t/font_2965250_i77r2jtt39e.woff2?t=1638262999381') format('woff2'),
       url('//at.alicdn.com/t/font_2965250_i77r2jtt39e.woff?t=1638262999381') format('woff'),
       url('//at.alicdn.com/t/font_2965250_i77r2jtt39e.ttf?t=1638262999381') format('truetype');
}
.iconfont{
    font-family:"iconfont" !important;
    font-size:16px;font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
  }
.navbar{
  width: 100%;
  height: 45px;
  background: white;
  border-bottom: 1px solid rgb(182, 180, 180);
  .navbarTop{
    display: flex;
    line-height: 45px;
    font-size: 16px;

    .back{
      margin-left: 5px;
    }
    .title{
     flex: 1;
     font-weight: 600;
     font-size: 18px;
     color: #999;
     margin-right:35px;
     text-align: center;
    }
  }
}
.back{
  font-size: 24px;
}
</style>
